/**
 * 自定义svg图标
 */

import { ReactElement } from "react";
import Icon from "@ant-design/icons";

interface SvgProps {
  className?: string;
  fill?: string;
  height?: number | string;
  style?: React.CSSProperties;
  width?: number | string;
}
interface IconFontProps<T> {
  Component: (props: T) => ReactElement;
  extraProps?: T;
  onClick?: () => void;
}

const IconFont: React.FC<IconFontProps<SvgProps>> = props => {
  const { Component, extraProps, onClick } = props;
  return (
    <Icon
      onClick={onClick}
      style={{ cursor: "pointer" }}
      component={() => <Component fill="red" {...extraProps} style={{ fontSize: 20, ...extraProps?.style }} />}
    />
  );
};

export default IconFont;
